<template>
  <div
    class="feature-item-card-container"
    :style="{ width: `${props.size}px`, height: `${props.size}px`, 'border-radius': `${props.size * 0.1}px` }"
  >
    <slot></slot>
    <span>{{ props.iconText }}</span>
  </div>
</template>

<script setup lang="ts">
const props = withDefaults(defineProps<{ iconText: string; size: number }>(), {
  iconText: '敬请期待',
  size: 100,
});
</script>

<style scoped>
.feature-item-card-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1px solid red;
}
</style>
